<!-- eslint-disable vue/multi-word-component-names -->
<template>
    <div>
        <div id="container">

            <div id="header" >
            </div>

        </div>
        <div id="container">
            <div id="content2">
                <table width="100%" height="41" border:="0" align:="center" cellpadding="0" cellspacing="0">
                    <tr>
                        <td width="15" height="18" align:="left" valign="top">
                            <div align:="left"></div>
                        </td>
                        <td width="385" align:="left" valign="bottom" class="12">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td height="4" colspan="2" align:="left" valign="bottom">

                        </td>
                    </tr>
                    <tr>
                        <td height="15" align:="left" valign="top">
                            &nbsp;
                        </td>
                        <td height="15" align:="left" valign="top" class="12">
                            <table width="100%" height="20" border:="0" cellpadding="0" cellspacing="0">
                                <tr>
                                    <td height="20">
                                        <div class="right_proaducts">我的位置&gt;&gt;科技项目申报&gt;管理项目分类列表<br />
                                            <br />
                                        </div>
                                        <el-form ref="form" :model="user" label-width="80px">
                                            <el-form-item label="名称">
                                                <el-input v-model="user.name"></el-input>
                                            </el-form-item>
                                            <el-form-item label="单位名称">
                                                <el-input v-model="user.unitname"></el-input>
                                            </el-form-item>
                                            <el-form-item label="国籍">
                                                <el-input v-model="user.nation"></el-input>
                                            </el-form-item>
                                            <el-form-item label="性别">
                                                <el-select v-model="user.sex" placeholder="请选择">
                                                    <el-option v-for="item in options" :key="item.value"
                                                        :label="item.label" :value="item.value">
                                                    </el-option>
                                                </el-select>
                                            </el-form-item>
                                            <el-form-item label="职称">
                                                <el-input v-model="user.title"></el-input>
                                            </el-form-item>
                                            <el-form-item label="电话">
                                                <el-input v-model="user.tel"></el-input>
                                            </el-form-item>
                                            <el-form-item label="简介">
                                                <el-input type="textarea" v-model="user.introduction"></el-input>
                                            </el-form-item>
                                            <el-form-item>
                                                <el-button type="primary" @click="update()">提交</el-button>
                                                <el-button @click="reset()">取消</el-button>
                                            </el-form-item>

                                        </el-form>
                                    </td>
                                </tr>
                            </table>
                        </td>
                        <td>
                            <div class="table_wz"></div>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</template>

<script>
import axios from '../../utils/Myaxios'


const options = {

    data() {
        return {
            uid: '',
            user: {
                expertid: '',
                name: '',
                unitname: '',
                nation: '',
                sex: '',
                tilte: '',
                tel: '',
                introduction: ''
            },
            options: [
                {
                    value: '男',
                    label: '男'
                },
                {
                    value: '女',
                    label: '女'
                }
            ],
        }
    },
    mounted() {
        this.getParams();
        this.getid();

    },
    methods: {
        getParams() {
            this.uid = this.$route.query.id
        },

        async getid() {
            const _axios = axios.create({
                baseURL: 'http://localhost:8080',
                withCredentials: true
            })
            const resp = await _axios.get('/experts', {
                params: {uid:this.uid}
            })
            this.expertid = resp.data.data
        },


        async update() {
            const _axios = axios.create({
                baseURL: 'http://localhost:8080',
                withCredentials: true
            })
            const resp = await _axios.post('/experts', {
                params: this.user
            })
            console.log(resp)
        },
        reset() {
            this.user = [];
        }
    }
}
export default options;
</script>

<style>

</style>